<!--
 * @Author: 偻儸小卒[EdisonLiu_]
 * @Date: 1970-01-01 08:00:00
 * @LastEditors: 偻儸小卒[EdisonLiu_]
 * @LastEditTime: 2020-04-08 16:40:37
 * @Description: 
 -->
<template>
  <commonPage :showHeader="true" :header_title="header_title">
    <div slot="page_body">
      <scroller
        ref="my_scroller"
        :on-refresh="refresh"
        :on-infinite="infinite"
        height="-40"
        refresh-layer-color="#4b8bf4"
        loading-layer-color="#ec4949"
        class="page_body"
      >
        <div class="page_body_cont">
          <router-link
            v-for="(match, index) in match_list"
            :to="'/match/match_detail/index/' + match.id"
            :key="index"
          >
            <matchInc class="match_lists" :match="match" />
          </router-link>
        </div>
      </scroller>
    </div>
  </commonPage>
</template>
<script>
import commonPage from "../common/commonPage";
import matchInc from "../plugin/match_inc";
export default {
  name: "match_list",
  data() {
    return {
      header_title: "赛事列表",
      classify_id: 0,
      search_text:'',
      match_list: []
    };
  },
  components: {
    commonPage,
    matchInc
  },
  created() {
    this.search_text = this.$route.query.search_text;
    console.log( this.search_text );
    this.classify_id = this.$route.params.classify_id;
    this.getMatchList();
    this.$wxShare(
      {
        title: "分享标题", // 分享标题
        desc: "分享描述", // 分享描述
        link: window.location.href // 分享链接
        //   debug:true
      },
      function() {
        //分享成功后的回调函数
      }
    );
  },
  methods: {
    getMatchList() {
      if(this.classify_id|| this.search_text){
        this.$axios
        .post("match.getMatchList", { classify_id: this.classify_id,search_text:this.search_text })
        .then(res => {
          this.match_list = res.result.list;
        })
        .catch(error => {
          console.log(error);
        });
      }
      
    },
    refresh(done) {
      let that = this;
      setTimeout(() => {
        that.$router.go(0);
        done();
      }, 1000);
    },
    infinite(done) {
      let that = this;
      setTimeout(() => {
        done(true);
      }, 1500);
    }
  }
};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style lang="stylus" scoped>
.page_body {
  margin-top: 47px;
  height: calc(100% - 47px);

  .page_body_cont {
    width: 90%;
    margin-left: 5%;
    padding-top: 0;

    .match_lists {
      margin-top: 1rem;
    }
  }
}
</style>